<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="com.hkw.model.Student" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page import="java.util.List" %><%--
  Created by IntelliJ IDEA.
  User: 12244
  Date: 2020/8/29
  Time: 13:17
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>
<head>
    <title>学生列表</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
</head>
<body>
<%--点击按钮，弹出模态框--%>
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
    添加
</button>
&nbsp;&nbsp;&nbsp;
<a href="classRoomList" class="btn btn-primary btn-lg active" role="button">班级管理</a>
&nbsp;&nbsp;&nbsp;
<a class="btn btn-default" href="outLogin" role="button">退出</a>
<form class="form-inline" action="search" method="post">
    <div class="form-group">
        <label for="name2">姓名</label>
        <input type="text" class="form-control" id="name2" placeholder="name" name="stname">
    </div>
    <div class="form-group">
        <label for="email2">邮箱</label>
        <input type="email" class="form-control" id="email2" placeholder="email" name="email">
    </div>
    <div class="form-group">
        <label for="classId1">班级编号</label>
        <input type="text" class="form-control" id="classId1" placeholder="email" name="classId">
    </div>
    <button type="submit" class="btn btn-default">搜索</button>
</form>
<%--表格标签显示所有学生信息--%>
<table class="table table-hover">
    <tr>
        <th>编号</th>
        <th>姓名</th>
        <th>性别</th>
        <th>生日</th>
        <th>邮箱</th>
        <th>班级编号</th>
        <th>备注</th>
        <th>修改</th>
        <th>删除</th>
    </tr>
<%--    <%--%>
<%--        List<Student> list = (List<Student>) request.getAttribute("stList");--%>
<%--        for (int i = 0;i < list.size();i++) {--%>
<%--    %>--%>
    <c:forEach var="v" items="${stList}">
    <tr>
        <td>${v.id}</td>
        <td>${v.name}</td>
        <td>${v.sex}</td>
        <td>${v.birthday}</td>
        <td>${v.email}</td>
        <td>${v.classId}</td>
        <td>${v.remark}</td>
        <td><a href="updateStudent?id=${v.id}">修改</a></td>
        <td><a href="delStudent?id=${v.id}">删除</a></td>
    </tr>
    </c:forEach>
<%--    <%--%>
<%--        }--%>
<%--    %>--%>
</table>
<%--分页样式--%>
<div align="center">
<nav aria-label="Page navigation">
    <ul class="pagination pagination-lg">
        <li>
            <a href="studentlist?nowpage=${reaPage - 1}" aria-label="Previous" id="left">
                <span aria-hidden="true">&laquo;</span>
            </a>
        </li>
<%--        <%=(Integer)request.getAttribute("reaPage")%>--%>
        <li><a href="#">${reaPage}</a></li>
        <li>
            <a href="studentlist?nowpage=${reaPage + 1}" aria-label="Next" id="right">
                <span aria-hidden="true">&raquo;</span>
            </a>
        </li>
    </ul>
</nav>
</div>
<%--模态框，用来添加学生信息--%>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">添加学生</h4>
            </div>
            <div class="modal-body">
                <form action="addStudent" method="post" onsubmit="return check()">
                    <div class="form-group">
                        <label for="name1">姓名</label>
                        <input type="text" class="form-control" id="name1" placeholder="username" name="stname">
                    </div>
                    <div class="form-group">
                        <label>性别</label>
                        <input type="radio" class="radio-inline"  name="sex" value="男" id="sex1">男
                        <input type="radio" class="radio-inline" name="sex" value="女" id="sex2">女
                    </div>
                    <div class="form-group">
                        <label for="date1">出生日期</label>
                        <input type="date" id="date1" name="birthday">
                    </div>
                    <div class="form-group">
                        <label for="email1">邮箱</label>
                        <input type="email" class="form-control" id="email1" placeholder="email" name="email">
                    </div>
                    <div class="form-group">
                        <label >班级编号</label>
<%--                        <input type="text" class="form-control" id="classid1" placeholder="classId" name="classId">--%>
                        <select class="form-control" name="classId">
                            <c:forEach items="${ids}" var="v">
                                <option value="${v.id}">${v.name}</option>
                            </c:forEach>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="remark1">备注</label>
                        <input type="text" class="form-control" id="remark1" placeholder="remark" name="remark">
                    </div>
                    <button type="submit" class="btn btn-default" id="addStudent">添加</button>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<%--修改成功，下面标签里有值--%>
<label hidden id="updatesuccess"><%=request.getAttribute("updatesuccess")%></label>
<%--修改失败，下面标签里有值--%>
<label hidden id="updateerror"><%=request.getAttribute("updateerror")%></label>
<%--查找失败，下面标签里有值--%>
<label hidden id="searcherror"><%=request.getAttribute("searcherror")%></label>
</body>
<script src="./js/jquery-3.3.1.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script>
    //校验方法
    function check(){
        if($("#name1").val()==null||$("#name1").val().trim()==""){
            alert("姓名不能为空!");
            return false;
        }else if($("#sex1:checked").val()!="男"&&$("#sex2:checked").val()!="女"){
            alert("性别不能为空!");
            return false;
        }else if($("#date1").val()==null||$("#date1").val().trim()==""){
            alert("生日不能为空!");
            return false;
        }else if($("#email1").val()==null||$("#email1").val().trim()==""){
            alert("邮箱不能为空!");
            return false;
        }else if($("#remark1").val()==null||$("#remark1").val().trim()==""){
            alert("备注不能为空!");
            return false;
        }
        return true;
    }
    //修改成功弹框提醒
    $(function(){
        var value = $("#updatesuccess").html();
        if(value != "null"){
            alert(value);
        }
    });
    //修改失败弹框提醒
    $(function(){
        var value = $("#updateerror").html();
        if(value != "null"){
            alert(value);
        }
    });
    //查找成功弹框提醒
    $(function(){
        var value = $("#searcherror").html();
        if(value != "null"){
            alert(value);
        }
    });
</script>
</html>
